<template>
	<view class="content">
        <!-- 公共组件-每个页面必须引入 -->
        <public-module></public-module>
        <view class="name">功能入口</view>
        <view class="cell-group">
            <view class="cell-item u-flex" @click="onJump('/pagesDome/canvas/canvas')">
                <view class="title u-flex-m">canvas万能方法，简单易用</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/showModal/showModal')">
                <view class="title u-flex-m">showModal自定义，只兼容app</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/sticky/sticky')">
                <view class="title u-flex-m">吸顶sticky，组件中用也不会失灵</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/login/login')">
                <view class="title u-flex-m">微信、支付宝小程序手机号个人信息授权登录、验证码登录、静默登录</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/http/http')">
                <view class="title u-flex-m">uni.$u.http接口示例</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/navbar/navbar')">
                <view class="title u-flex-m">导航栏navbar基于uview2.0制作</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/pay/pay')">
                <view class="title u-flex-m">万能支付</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/mescroll/mescroll')">
                <view class="title u-flex-m">mescroll下拉刷新上拉加载分页</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/cartAnimation/cartAnimation')">
                <view class="title u-flex-m">加入购物车抛物线动画</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
            <view class="cell-item u-flex" @click="onJump('/pagesDome/getLocation/getLocation')">
                <view class="title u-flex-m">获取定位信息</view>
                <u-icon name="arrow-right" size="14" color="#333"></u-icon>
            </view>
        </view>
        <f-tabbar></f-tabbar>
	</view>
</template>

<script>
import fTabbar from '@/components/module/f-tabbar/f-tabbar';
export default {
    components:{
        fTabbar
    },
    data() {
        return {

        }
    },
    onLoad() {
        // 隐藏原生的tabbar
        uni.hideTabBar();
    },
    methods: {
        onJump(url){
            uni.navigateTo({
                url:url
            })
        }
    },

}
</script>

<style lang="scss" scoped>
.name{
    padding: 24rpx;
    font-size: 32rpx;
    font-weight: bold;
}
.cell-group{
    .cell-item{
        border-bottom: 2rpx solid #eee;
        background-color: #fff;
        border-radius: 10rpx;
        padding: 20rpx 24rpx;
        .title{
            color: #333;
            font-size: 28rpx;
            padding: 0 10rpx;
            font-weight: bold;
            margin: 0;
        }
        .more{
            font-size: 24rpx;
            color: #999;
        }
    }
}
</style>
